<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<!--标准mui.css-->
		<link rel="stylesheet" href="css/mui.min.css">
		<!--App自定义的css-->
		<link rel="stylesheet" type="text/css" href="css/app.css" />
	</head>
	<body>
		<div class="mui-content">
			<div id="content_div">
				
			</div>
		</div>
	</body>
	<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
	<script src="js/countDown.min.js"></script>
	<script src="https://cdn.bootcdn.net/ajax/libs/dayjs/1.10.3/dayjs.min.js"></script>
	<script>
		var url = "https://service-pfvvhwdq-1259353583.gz.apigw.tencentcs.com/release/getqqjh";
		var nextTime = '2021/4/17 09:00:00'

		function drawCountDown() {
			$(".next_time").html(`
                下次直播时间预计为：${nextTime}
            `)

			$(".count_down").countDown({
				times: nextTime,
				days: true,
				ms: true,
				Hour: true,
				msValue: 90, //毫秒间隔
				unit: {
					days: '天',
					hour: '时',
					min: '分',
					second: '秒'
				}
			}, function() {

			});

		}


		function getData() {
			$.ajax({
				dataType: "json",
				url: url,
				data: {},
				success: function(data) {
					draw(data)
				}
			});
		}



		function draw(data) {
			var html = '';
			var httpReg = /(http:\/\/)?([A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*)/g;
		
			for (var j = 0; j < data.length; j++) {
				var msg_content = data[j].msg_content;
				var sender_time = data[j].sender_time;
				var YmdHis = dayjs.unix(sender_time);
				html += `
					<div class="mui-card">
						<div class="mui-card-content" >
							<div class="mui-card-content-inner">
								<p>${ YmdHis.format('YYYY-MM-DD HH:mm:ss')}</p>
				`;

				for (var i = 0; i < msg_content.length; i++) {
					var a = msg_content[i];
					var msg_type = a.msg_type;
					if (msg_type == 1) {
						var text = a.text;
						text = text.replace(
							httpReg,
							function(a,b,c){
								return '<a href="http://'+c+'" target="_blank" > 链接 </a>';
							}
						);
						html += `
								<p style="color: #333;">${text}</p>
						`
					}
					if (msg_type == 3) {
						html += `
								<img width="100%" src="${a.image_url}" />
						`
					}
				}
				html += `
							</div>
						</div>
					</div>`;
			}
			$("#content_div").html(html);
		}
		$(document).ready(function() {
			// drawCountDown()
			getData();
		});
	</script>
</html>
